<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2019/9/26
  Time: 10:26
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<html>
<head>
    <title>角色增加</title>
    <script src="../res/js/layui/layui.js"></script>
    <link href="../res/js/layui/css/layui.css" rel="stylesheet">
    <script crossorigin="anonymous" integrity="sha384-vk5WoKIaW/vJyUAd9n/wmopsmNhiy+L2Z+SBxGYnUkunIxVxAv/UtMOhba/xskxh" src="https://lib.baomitu.com/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@8"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script
            src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js"
            integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa"
            crossorigin="anonymous"></script>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet"
          href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css"
          integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u"
          crossorigin="anonymous">

    <script src="../res/js/Tools.js"></script>
</head>
<body>

    <script>
        var tree = null;
        var form = null;
        layui.use(['form', 'layedit', 'laydate','tree','util'], function() {
            var layer = layui.layer
                , layedit = layui.layedit
                , laydate = layui.laydate
                ,util = layui.util;
            tree = layui.tree;
            form = layui.form;
            getModule();

            $("#closeAdd").on('click',function(obj){
                $('#myModal').modal('hide');
                $("#flowerId").val("");
                document.getElementById("addForm").reset();
            });

            //按钮事件
            util.event('lay-demo', {
                getChecked: function(othis){
                    $('#myModal').modal('hide');
                }
            });


            //监听提交
            $("#demo1").on("click",function (obj) {
                var nameText = $("#chaName").val().length;
                if(nameText<=0){
                    layer.msg("请输入角色名称");
                    return;
                }

                var checkedData = tree.getChecked('demoId1'); //获取选中节点的数据

                var fromData = getFormData("fromone");

                var url = "../CharacterController/addOrUpdate.action";
                var s1  = {'json':JSON.stringify(checkedData)};

                var json = {};

                json = eval('('+(JSON.stringify(s1)+JSON.stringify(fromData)).replace(/}{/,',')+')');




                $.post(url,json,function(obj){
                    if(obj.state==1){

                        layer.msg(obj.msg, {
                            icon: 1,
                            time: 500 //0.5秒关闭（如果不配置，默认是3秒）
                        }, function(){
                            //关闭当前层
                            //当你在iframe页面关闭自身时
                            var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                            parent.layer.close(index); //再执行关闭
                            //刷新父页面
                            //parent.location.reload();
                        });

                    }else{
                        layer.msg(obj.msg);
                    }
                },"json");


                return false;
            });
        });

        /**
         * 获取模板
         */
        function getModule() {
            var url = "../ModuleController/selectAll.action";
            var data = null;
            $.post(url,data,function (obj) {

                //开启复选框
                tree.render({
                    elem: '#test7'
                    ,id: 'demoId1'
                    ,data: obj
                    ,showCheckbox: true
                });

                var id = getQueryString("id");
                if (id !="" && id!=null) {
                    findByid(id);
                }

            },"json");
        }


        function findByid(id) {
            var url = "../CharacterController/findById.action";
            var data = {id:id};
            $.post(url,data,function (obj) {
                $("#chaId").val(obj.chaId);
                $("#chaName").val(obj.chaName);
                $("#chaSort").val(obj.chaSort);

                if("on"==obj.chaState){
                    form.val('example', {
                        "chaState": true //开关状态
                    })
                }else{
                    form.val('example', {
                        "chaState": false //开关状态
                    })
                }



                $("#chaComment").val(obj.chaComment);

                var url = "../RolesModulesController/select.action";
                var data = {chaId:obj.chaId};
                $.post(url,data,function (obj) {
                    var ids = [];
                    $.each(obj,function (i,item) {
                        ids[i] = item.modId;
                    });
                    console.info(ids);
                    tree.setChecked('demoId1', ids); //勾选指定节点
                },"json");
            },"json");
        }

    </script>

    <form class="layui-form" action="" lay-filter="example" id="fromone">
        <input type="hidden" name="chaId" id="chaId">
        <div class="layui-form-item">
            <label class="layui-form-label">名称</label>
            <div class="layui-input-block">
                <input type="text" name="chaName" id="chaName" lay-verify="title" autocomplete="off" placeholder="请输入名称" class="layui-input" maxlength="20">
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label">排序</label>
            <div class="layui-input-block">
                <input type="text" name="chaSort" id="chaSort" lay-verify="title" autocomplete="off" placeholder="请输入序号" class="layui-input" maxlength="10" onkeyup="this.value=this.value.replace(/[^\d]/g,'')" onafterpaste="this.value=this.value.replace(/[^\d]/g,'')">
            </div>
        </div>


        <div class="layui-form-item">
            <label class="layui-form-label">状态</label>
            <div class="layui-input-block">
                <input type="checkbox" checked="" name="chaState" id="chaState" lay-skin="switch" lay-text="启用|禁用">
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-block">
                <textarea placeholder="请输入内容" class="layui-textarea" name="chaComment" id="chaComment" maxlength="20"></textarea>
            </div>
        </div>

        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">权限</label>
            <div class="layui-input-block">
                <button type="button" class="btn btn-success" data-toggle="modal" data-target="#myModal">
                    模块权限
                </button>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-input-block">
                <input type="button" value="保存" class="layui-btn" id="demo1"></input>
            </div>
        </div>
    </form>

    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">权限管理</h4>
                </div>
                <div class="modal-body">
                    <form id="addForm" action="" method="post" enctype="multipart/form-data">
                        <div class="form-group">
                            <div id="test7" class="demo-tree"></div>
                        </div>
                        <div class="form-group">
                            <button type="button" class="layui-btn layui-btn-sm" lay-demo="getChecked">确定</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

</body>
</html>
